<template>
    <div>
        编号<input type="text" name="" v-model="page.number" id="">
        名称<input type="text" name="" v-model="page.name" id="">
        <input type="button" value="查询" @click="show">
        <a :href="'https://localhost:7094/api/Xlsx'">导出</a>
<table>
   <thead>
    <tr>
        <td>编号</td>
        <td>名称</td>
        <td>操作</td>
    </tr>
   </thead>
   <tbody>
    <tr v-for="a in list">
        <td>{{a.number  }}</td>
        <td>{{ a.name }}</td>
        <td>
            <input type="button" value="删除" @click="del(a.hid)">
            <input type="button" value="修改" @click="find(a.hid)">
        </td>
    </tr>
   </tbody>
</table>
<input type="button" value="首页" @click="fan(1)">
<input type="button" value="上一页" @click="fan(2)">
<input type="button" value="下一页" @click="fan(3)">
<input type="button" value="尾页" @click="fan(4)">
当前第{{page.pagenow  }}页  每页{{page.pagehang  }}行  共{{count.pagecount  }}页 共{{count.count  }}条

<input type="text" name="" v-model="page.pagenow" id="">
        <input type="button" value="翻页" @click="f">
      跳转  <select v-model="page.pagehang" @change="h">
<option>2</option>
<option>4</option>
<option>5</option>
        </select>
    </div>
</template>

<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';
import { useRouter } from 'vue-router';

onMounted(()=>{
    show()
})
const h=()=>{
    show()
}
const find=(vid:any)=>{
router.push({path:"/update",query:{id:vid}})

}
const f=()=>{
    show()
}
const fan=(a:any)=>{
    if(a==1){
        page.value.pagenow=1
        show()
    }
    if(a==2){
        if(page.value.pagenow>1){
            page.value.pagenow-=1
            show()
        }
        
    }
    if(a==3){
        if(page.value.pagenow<count.value.pagecount){
            page.value.pagenow+=1
            show()
        }
        
    }
    if(a==4){
        page.value.pagenow=count.value.pagecount
        show()
    }

}
const router=useRouter()
const show=()=>{
    axios.get('https://localhost:7094/api/House/Show',{params:page.value}).then(res=>{
list.value=res.data.list
count.value.count=res.data.count
count.value.pagecount=Math.ceil(count.value.count/page.value.pagehang)


    })
}
const del=(vid:any)=>{
    if(!confirm("确认删除吗")){
        return;
    }
    axios.get('https://localhost:7094/api/House/Del',{params:{id:vid}}).then(res=>{
        if(res.data>0){
            alert("成功")
            show()
        }else{
            alert('失败')
        }
    })
}
const count=ref({
    count:0,
    pagecount:0
})
const page=ref({
    pagenow:1,
    pagehang:2,
    number:"",
    name:""


})
const list=ref([{
    "hid": 0,
  "number": "",
  "name": ""
}])
</script>

<style scoped>

</style>